import React, { Component } from 'react'
import "../../asset/css/login.css"
import Header from "./component/DefaultHeader"
export default class Login extends Component {
    state = {
        phone: "",
        password: ""
    }
    submit() {
        const { phone, password } = this.state
        if (phone === "") {
            return alert("手机号不可以为空")
        }
        if (password === "") {
            return alert("密码不可以为空")
        }
        this.$axios.post("/login", { phone, password }).then(res => {
            if (res.code === 200 && res.msg === "登录成功") {
                //清空表单
                this.setState({
                    phone: "",
                    password: ""
                })
                //存储登录的凭证
                localStorage.setItem("login_data", JSON.stringify(res.list))
                //跳转到个人中心
                this.props.history.push("/uncenter")
                this.props.restCarList()
            }
        })
    }
    render() {
        const { phone, password } = this.state
        return (
            <div className="login-container">
                <Header title="会员登录" right_text="注册" right_method={() => this.props.history.push("/register")} />
                <div className="logo"></div>
                <div className="form">

                    <div className="form-group">
                        <input type="text" placeholder="手机号" value={phone} onChange={(e) => this.setState({ phone: e.target.value.trim() })} />
                    </div>
                    <div className="form-group">
                        <input type="password" placeholder="密码" value={password} onChange={(e) => this.setState({ password: e.target.value.trim() })} />
                    </div>
                    <div className="form-group">
                        <button className="btn-gray" onClick={() => this.submit()}>登录</button>
                    </div>
                </div>
            </div>
        )
    }
}
